<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户管理</title>

    <script src="https://lib.sinaapp.com/js/jquery/3.1.0/jquery-3.1.0.js"></script>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
</head>

<body>
<div class="row" style="margin-top: 15px;">
    <h1 style="font-family: 'YouYuan'; color: rgb(0, 85, 255);" id="title" class="col-sm-10 col-sm-offset-1">用户管理页面:
    </h1>
</div>

<div class="container">
    <div class="row clearfix" style="margin-top: 30px;">
        <%--    <div class="col-sm-3 col-sm-offset-2">--%>
        <div class="col-md-4 column">
            <a href="${pageContext.request.contextPath}/book/query" style="display: inline-block;">
                <button class="btn btn-primary btn-warning">返回</button>
            </a>
            <div style="display: inline-block;">
                <div class="form-group">
                    <c:if test="${queryMessage == null}">
                        <button class="btn btn-primary" data-toggle="modal" data-target="#addModal">添加管理员</button>
                    </c:if>
                    <c:if test="${queryMessage != null}">
                        <a class="btn btn-primary" href="${pageContext.request.contextPath}/user/toUserPaper">回到主页面</a>
                    </c:if>
                </div>
            </div>
        </div>
        <div class="col-lg-8 column text-right">
            <form action="${pageContext.request.contextPath}/user/queryUser" class="form-inline">
                <div class="form-group">
                    <span style="color: red; font-weight: bold">${queryMessage}</span>
                    <input class="form-control" placeholder="请输入姓名" autocomplete="off" id="username" name="userName"
                           required>
                </div>
                <div class="form-group">
                    <button class="btn btn-primary">搜索</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- 添加 -->
<div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title" id="myModalLabel">添加管理员</h4>
            </div>
            <form action="${pageContext.request.contextPath}/user/signupAdmin" id="lg-form" name="lg-form"
                  class="form-horizontal" method="post">
                <div class="modal-body">
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="email">邮箱</label>
                        <div class="col-sm-9">
                            <input id="email" type="email" name="email" class="form-control" required/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="name">姓名</label>
                        <div class="col-sm-9">
                            <input id="name" type="text" name="userName" class="form-control" required/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="psd">密码</label>
                        <div class="col-sm-9">
                            <input id="psd" type="password" name="password" class="form-control" required/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="repsd">确认密码</label>
                        <div class="col-sm-9">
                            <input id="repsd" type="password" name="repassword" class="form-control" required/>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="submit" class="btn btn-primary">确定</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-sm-8 col-sm-offset-2">
        <table id="dataTable" class="table table-hover table-bordered table-striped table-condensed "
               style="margin-top: 15px;">
            <thead>
            <tr class="info">
                <th style="text-align: center;">邮箱</th>
                <th style="text-align: center;">姓名</th>
                <th style="text-align: center;">权限</th>
                <th style="text-align: center;">操作</th>
            </tr>
            </thead>

            <c:forEach items="${userList}" var="user">
                <tr style="text-align: center">
                    <td>${user.email}</td>
                    <td>${user.userName}</td>
                    <td>
                        <c:choose>
                            <c:when test="${user.authority == 'general'}">普通用户</c:when>
                            <c:otherwise>管理员</c:otherwise>
                        </c:choose>
                    </td>
                    <td style="text-align: center;">
                        <button class="btn btn-danger btn-xs" onclick="deleteUserByEmail('${user.email}')">删除</button>
                        <button class="btn btn-info btn-xs"
                                onclick="window.document.location='${pageContext.request.contextPath}/user/toEditUser?email=' + '${user.email}'">
                            编辑
                        </button>
                    </td>
                </tr>
            </c:forEach>

        </table>
    </div>
</div>
</body>

<script>

    var lgform = document.getElementById("lg-form");
    var password = document.getElementById("psd");
    var newPassword = document.getElementById("repsd");
    lgform.onsubmit = function () {
        /*   if (password.value == "" || password.value == null) {
              alert("新密码不能为空,请输入");
              return false;
          } else if (newPassword.value == "" || newPassword.value == null) {
              alert("确认密码不能为空,请输入");
              return false;
          } else */
        if (password.value != newPassword.value) {
            alert("两次密码不一样,请重新输入");
            password.value = "";
            newPassword.value = "";
            return false;
        } else {
            return true;
        }
    }

    function deleteUserByEmail(email) {
        if (window.confirm("确定删除该用户吗？")) {
            document.location.href = "${pageContext.request.contextPath}/user/deleteUser?email=" + email;
        }
    }
</script>


</html>
